---
title: Getting Started
description: A basic intro to Astro.
i18nReady: true
tableOfContents: false
editUrl: false
next: false
banner:
  content: |
    <a href="https://astro.build/blog/astro-4/">Astro version 4.0 is here!</a>
    Are you ready to upgrade? <a href="/en/guides/upgrade-to/v4/">Read our upgrade guide</a>.
hero:
  title: Astro Docs
  tagline: Guides, resources, and API references to help you build with Astro.
  actions:
    - text: Get started
      icon: rocket
      link: /en/install/auto/
      variant: primary
    - text: Learn about Astro’s features
      icon: right-arrow
      link: /en/concepts/why-astro/
  facepile:
    tagline: Powered by Astro and our open-source contributors.
    linkText: Join us!
    link: /en/contribute/
---

import { CardGrid } from '@astrojs/starlight/components'
import Card from '~/components/Landing/Card.astro'
import ListCard from '~/components/Landing/ListCard.astro'
import SplitCard from '~/components/Landing/SplitCard.astro'
import Discord from '~/components/Landing/Discord.astro'

<CardGrid>
  <Card title="What will you build with Astro?" icon="laptop">
    Explore [Astro starter themes](https://astro.build/themes/) for blogs, portfolios, docs, landing pages, SaaS, marketing, ecommerce sites, and more!
  </Card>

  <Card title="Take a guided tour" icon="star">
    Complete our introductory [Build a Blog Tutorial](/en/tutorial/0-introduction/) to learn the basics and create your first Astro site.
  </Card>

  <SplitCard title="Start a new project" icon="rocket">
    ```sh
    # create a new project with npm
    npm create astro@latest
    ```
    
    Our [installation guide](/en/install/auto/) has step-by-step instructions for installing Astro using our CLI wizard, creating a new project from an existing Astro GitHub repository, and for installing Astro manually.
  </SplitCard>

  <ListCard title="Learn" icon="open-book">
    - [Astro's main features](/en/concepts/why-astro/)
    - [Island architecture](/en/concepts/islands/)
    - [Astro components](/en/basics/astro-components/)
    - [The Astro template syntax](/en/basics/astro-syntax/)
  </ListCard>

  <ListCard title="Extend" icon="puzzle">
    - [Add integrations like React, and Tailwind](/en/guides/integrations-guide/)
    - [Create type safe content collections](/en/guides/content-collections/)
    - [Enhance navigation with view transitions](/en/guides/view-transitions/)
    - [Connect a headless CMS to your project](/en/guides/cms/)
  </ListCard>
</CardGrid>

<Discord title="Have a question or want to get involved?" cta="Join our Discord"/>
